@import"./reset";
@import"./common";
@import"./vw";
header{
    width: vw(750);
    height: vw(118);
    .top{
        width: vw(704);
        height: vw(57);
        margin: 0 auto;
        // margin-top: vw(30);
        display: flex;
        justify-content: space-between;
        line-height: vw(128);
        text-align: center;
        .top1{
            width: vw(123);
            // height: vw(57);
            border: 1px solid #ff9344;
            border-radius: vw(20);
            font-size: vw(26);
            line-height: vw(57);
            text-align: center;
            position: relative;
            top: vw(40);
        }
        .top2 span{
            font-size: vw(26);
        }
        .top3{
            width: vw(52);
            height: vw(50);
            line-height: vw(150);
            img{
                width: vw(52);
            }
        }
    }
}
section{
    width: vw(750);
    .banner{
        width: vw(705);
        height: vw(200);
        margin: 0 auto;
        img{
            width: vw(705);
            height: vw(200);
            // margin-top: vw(20);
        }
    }
    .money{
        width: vw(666);
        height: vw(100);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        span{
            display: inline-block;
            color: #ff9344;
            font-size: vw(72);
        }
        bottom{
            width: vw(111);
            height: vw(59);
            background:#ff9344 ;
            border-radius: vw(20);
            text-align: center;
            line-height: vw(59);
            font-size: vw(30);
            a{
                color: white;
            }
        }
    }
    .good{
        width: vw(704);
        height: vw(83);
        display: flex;
        justify-content: space-between;
        line-height: vw(57);
        margin: 0 auto;
        text-align: center;
        .left{
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .left img{
            width: vw(50);
            height: vw(50);
        }  
        .left span{
            font-size: vw(30);
            margin-left: vw(10);
            line-height: vw(65);
        }
        span:first-of-type{
            color: black;
            font-size: vw(30);
        }
        span:nth-of-type(2){
            font-size: vw(30);
            margin-left: vw(10);
            line-height: vw(65);
            color: #ff9344;
        }
        .right a{
            color: black;
            font-size: vw(24);
            line-height: vw(65);
            color: #8c8c8c;
            text-align: center;
        }
    }
    .try{
        width: vw(664);
        height: vw(67);
        background:#ff9344 ;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        text-align: center;
        line-height: vw(67);
        span{
            font-size: vw(30);
            color: white;
            margin-left: vw(10);
        }
        span:nth-of-type(2){
            margin-right: vw(10);
        }
    }
    .goods{
        width: vw(664);
        height: vw(196);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        flex-wrap: wrap;
        .g-img{
            width: vw(177);
            height: vw(176);
            img{
                width: vw(177);
                height: vw(176);
            }
        }
        .shousi{
            width: vw(300);
            height: vw(176);
            position: relative;
            img{
                width: vw(188);
                height: vw(38);
            }
            p{
                font-size: vw(30);
            }
            span{
                display: block;
                font-size: vw(26);
                color: #8c8c8c;
                line-height: vw(44);
                // text-align: center;
            }
            span:nth-of-type(2)::after{
                content: "正佳店";
                position: absolute;
                right: vw(327);
                color: black;
                font-size: vw(24);
                display: inline-block;
                width: vw(185);
                height: vw(39);
                background: white;
                text-align: center;
                line-height: vw(39);
                opacity: 0.6;
            }
            a{
                color: #ff9344;
            }
        }
        .good-right{
            width: vw(130);
            height: vw(70);
            bottom{
            display: inline-block;
            width: vw(111);
            height: vw(59);
            background:#ff9344 ;
            border-radius: vw(20);
            text-align: center;
            line-height: vw(59);
            a{
                color: white;
                font-size: vw(30);
            }
            }
        }
    }
    .goods-two{
        width: vw(664);
        height: vw(196);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        flex-wrap: wrap;
        .g-img{
            width: vw(177);
            height: vw(176);
            img{
                width: vw(177);
                height: vw(176);
            }
        }
        .shousi{
            width: vw(300);
            height: vw(176);
            position: relative;
            img{
                width: vw(188);
                height: vw(38);
            }
            p{
                font-size: vw(30);
            }
            span{
                display: block;
                font-size: vw(26);
                color: #8c8c8c;
                line-height: vw(44);
                // text-align: center;
            }
            span:nth-of-type(2)::after{
                content: "体育西店";
                position: absolute;
                right: vw(327);
                color: black;
                font-size: vw(24);
                display: inline-block;
                width: vw(185);
                height: vw(39);
                background: white;
                text-align: center;
                line-height: vw(39);
                opacity: 0.6;
            }
            a{
                color: #ff9344;
            }
        }
        .good-right{
            width: vw(130);
            height: vw(70);
            bottom{
            display: inline-block;
            width: vw(111);
            height: vw(59);
            background:#ff9344 ;
            border-radius: vw(20);
            text-align: center;
            line-height: vw(59);
            a{
                color: white;
                font-size: vw(30);
            }
            }
        }
    }
    .goods-three{
        width: vw(664);
        height: vw(196);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 auto;
        flex-wrap: wrap;
        .g-img{
            width: vw(177);
            height: vw(176);
            img{
                width: vw(177);
                height: vw(176);
            }
        }
        .shousi{
            width: vw(300);
            height: vw(176);
            position: relative;
            img{
                width: vw(188);
                height: vw(38);
            }
            p{
                font-size: vw(30);
            }
            span{
                display: block;
                font-size: vw(26);
                color: #8c8c8c;
                line-height: vw(44);
                // text-align: center;
            }
            span:nth-of-type(2)::after{
                content: "昌岗店";
                position: absolute;
                right: vw(327);
                color: black;
                font-size: vw(24);
                display: inline-block;
                width: vw(185);
                height: vw(39);
                background: white;
                text-align: center;
                line-height: vw(39);
                opacity: 0.6;
            }
            a{
                color: #ff9344;
            }
        }
        .good-right{
            width: vw(130);
            height: vw(70);
            bottom{
            display: inline-block;
            width: vw(111);
            height: vw(59);
            background:#ff9344 ;
            border-radius: vw(20);
            text-align: center;
            line-height: vw(59);
            a{
                color: white;
                font-size: vw(30);
            }
            }
        }
    }
}